${r'<'}template${r'>'}
    ${r'<'}Page class="wrap_page" :use-header="true" title="${obj.name}"${r'>'}
        ${r'<'}Edit ref="refEdit" :title="editDrawerTitle" /${r'>'}
        ${r'<'}a-card${r'>'}
            ${r'<'}Query /${r'>'}
        ${r'<'}/a-card${r'>'}
        ${r'<'}a-card${r'>'}
            ${r'<'}Operation @insert="handleInsert" style="margin-bottom: 16px;" /${r'>'}
            ${r'<'}Table ref="refTable" @update="handleUpdate" /${r'>'}
        ${r'<'}/a-card${r'>'}
    ${r'<'}/Page${r'>'}
${r'<'}/template${r'>'}

<#noparse>
<script setup lang="ts">
</#noparse>
import { ref, onMounted } from 'vue';
// Component
import Page from '@/component/layout/Page.vue';
import Edit from '@/component/${obj.relativePath}/${obj.classPrefix}Edit.vue';
import Query from '@/component/${obj.relativePath}/${obj.classPrefix}Query.vue';
import Operation from '@/component/${obj.relativePath}/${obj.classPrefix}Operation.vue';
import Table from '@/component/${obj.relativePath}/${obj.classPrefix}Table.vue';

const refEdit = ref();
const refTable = ref();
const editDrawerTitle = ref('');

onMounted(() => {
    init();
});

const init = () => {
    refTable.value.refresh();
}

const handleInsert = () => {
    editDrawerTitle.value = '新增${obj.name}';
    refEdit.value.open();
}

const handleUpdate = (id: string) => {
    editDrawerTitle.value = '修改${obj.name}';
    refEdit.value.open(id);
}

<#noparse>
</script>
</#noparse>

<#noparse>
<style lang="less" scoped>
.wrap_page {
    .ant-card {
        margin-top: 24px;

        &:first-child {
            margin-top: 0;
        }
    }
}
</style>
</#noparse>
